<template>
  <div class="app-container">
    <div class="authorized-change">
      <el-row :gutter="10" class="authorized-card">
        <el-col :span="10" class="authorized-list">
          <el-card class="" shadow="never">
            <div class="list">
              <div class="header">
                <div class="header-title" style="display: flex">
                  <span style="width: 190px; line-height: 32px"
                    >{{ localOrgName }}详情</span
                  >

                  <el-select
                    v-model="getLocalDetailParams.officeId"
                    clearable
                    placeholder="请选择处"
                    style="margin-left: 20px"
                    size="small"
                    @change="localOfficeSelect"
                  >
                    <el-option
                      v-for="item in localOfficeList"
                      :key="item.id"
                      :label="item.orgName"
                      :value="item.id"
                    >
                    </el-option>
                  </el-select>
                </div>
              </div>
              <div class="authorized-info">
                <div class="show-title">目前状态</div>
                <div class="btn-content">
                  <span class="sub-title">行政</span>
                  <span class="sub-content">{{
                    localOfficeInfo.orgAdminNow
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">事业</span
                  ><span class="sub-content">{{
                    localOfficeInfo.orgCauseNow
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">工勤</span
                  ><span class="sub-content">{{
                    localOfficeInfo.orgWorkNow
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">单列</span
                  ><span class="sub-content">{{
                    localOfficeInfo.orgSingleNow
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">总数</span
                  ><span class="sub-content">{{
                    localOfficeInfo.orgNowTotal
                  }}</span>
                </div>
              </div>
              <div class="authorized-info">
                <div class="show-title">预设编制</div>
                <div class="btn-content">
                  <span class="sub-title">行政</span>
                  <span class="btn" @click="subtractClick('organ_admin')"
                    ><el-button
                      size="mini"
                      type="primary"
                      icon="el-icon-minus"
                      circle
                      plain
                    ></el-button
                  ></span>
                  <span class="sub-content">{{ localOfficeInfo.orgAdmin }}</span
                  ><span class="btn" @click="plusClick('organ_admin')"
                    ><el-button
                      size="mini"
                      type="primary"
                      icon="el-icon-plus"
                      circle
                      plain
                    ></el-button
                  ></span>
                </div>
                <div class="btn-content">
                  <span class="sub-title">事业</span>
                  <span class="btn" @click="subtractClick('organ_cause')"
                    ><el-button
                      size="mini"
                      type="primary"
                      icon="el-icon-minus"
                      circle
                      plain
                    ></el-button
                  ></span>
                  <span class="sub-content">{{
                    localOfficeInfo.orgCause
                  }}</span>
                  <span class="btn" @click="plusClick('organ_cause')"
                    ><el-button
                      size="mini"
                      type="primary"
                      icon="el-icon-plus"
                      circle
                      plain
                    ></el-button
                  ></span>
                </div>
                <div>
                  <span class="sub-title">工勤</span>
                  <span class="btn" @click="subtractClick('organ_work')"
                    ><el-button
                      size="mini"
                      type="primary"
                      icon="el-icon-minus"
                      circle
                      plain
                    ></el-button
                  ></span>
                  <span class="sub-content">{{ localOfficeInfo.orgWork }}</span>
                  <span class="btn" @click="plusClick('organ_work')"
                    ><el-button
                      size="mini"
                      type="primary"
                      icon="el-icon-plus"
                      circle
                      plain
                    ></el-button
                  ></span>
                </div>
                <div>
                  <span class="sub-title">单列</span>
                  <span class="btn" @click="subtractClick('organ_single')"
                    ><el-button
                      size="mini"
                      type="primary"
                      icon="el-icon-minus"
                      circle
                      plain
                    ></el-button
                  ></span>
                  <span class="sub-content">{{
                    localOfficeInfo.orgSingle
                  }}</span>
                  <span class="btn" @click="plusClick('organ_single')"
                    ><el-button
                      size="mini"
                      type="primary"
                      icon="el-icon-plus"
                      circle
                      plain
                    ></el-button
                  ></span>
                </div>
                <div>
                  <span class="sub-title">总数</span
                  ><span class="sub-content">{{
                    localOfficeInfo.orgPrepareTotal
                  }}</span>
                </div>
              </div>
              <div class="show-list">
                <el-table
                  :data="localOfficeInfo.departmentDetail"
                  height="100%"
                  ref="singleTable"
                  border
                  style="width: 100%"
                  size="mini"
                  highlight-current-row
                  @current-change="handleCurrentChange"
                  :header-cell-style="{
                    background: '#409EFF',
                    color: '#FFFFFF',
                  }"
                >
                  <template slot="empty">
                    <p style="margin-top: -10px">暂无数据</p>
                  </template>
                  <el-table-column
                    prop="orgName"
                    label="科室名称"
                    min-width="120"
                  >
                  </el-table-column>
                  <el-table-column
                    prop="prepareTotal"
                    label="编制数"
                    width="100"
                  >
                  </el-table-column>
                  <el-table-column prop="actualNum" label="人数" width="100">
                  </el-table-column>
                  <el-table-column
                    prop="overTotal"
                    label="超空编"
                    width="100"
                    :render-header="renderHeader"
                  >
                  </el-table-column>
                </el-table>
              </div>
            </div>
          </el-card>
        </el-col>
        <el-col :span="4" class="authorized-btn">
          <el-card
            class=""
            shadow="never"
            style="background-color: rgba(0, 0, 0, 0)"
          >
            <div class="introduce">
              <div class="authorized-btn-i">
                <i class="el-icon-arrow-right" style="font-weight: bold"></i>
              </div>
              <div>单向调度</div>
            </div>
          </el-card>
        </el-col>
        <el-col :span="10" class="authorized-list">
          <el-card class="" shadow="never">
            <div class="list right-list">
              <div class="header-other">
                <div style="display: flex">
                  <el-select
                    v-model="getSelectDetailParams.orgId"
                    clearable
                    placeholder="请选择机构"
                    filterable
                    size="small"
                    @change="getSelectOfficeOrg"
                  >
                    <el-option
                      v-for="item in orgList"
                      :key="item.id"
                      :label="item.orgName"
                      :value="item.id"
                    >
                    </el-option>
                  </el-select>
                  <i
                    style="line-height: 32px"
                    class="el-icon-user-solid show-color"
                    @click="
                      officeLeaderClick(getSelectDetailParams.orgId, 'jg')
                    "
                  ></i>
                </div>
                <div style="display: flex">
                  <el-select
                    v-model="getSelectDetailParams.officeId"
                    clearable
                    placeholder="请选择处"
                    filterable
                    size="small"
                    @change="getSelectOffice"
                  >
                    <el-option
                      v-for="item in selectOfficeList"
                      :key="item.id"
                      :label="item.orgName"
                      :value="item.id"
                    >
                    </el-option>
                  </el-select>
                  <i
                    style="line-height: 32px"
                    class="el-icon-user-solid show-color"
                    @click="
                      officeLeaderClick(getSelectDetailParams.officeId, 'cj')
                    "
                  ></i>
                </div>
              </div>
              <div class="authorized-info">
                <div class="show-title">目前状态</div>
                <div class="btn-content">
                  <span class="sub-title">行政</span>
                  <span class="sub-content">{{
                    selectOfficeInfo.orgAdminNow
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">事业</span
                  ><span class="sub-content">{{
                    selectOfficeInfo.orgCauseNow
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">工勤</span
                  ><span class="sub-content">{{
                    selectOfficeInfo.orgWorkNow
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">单列</span
                  ><span class="sub-content">{{
                    selectOfficeInfo.orgSingleNow
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">总数</span
                  ><span class="sub-content">{{
                    selectOfficeInfo.orgNowTotal
                  }}</span>
                </div>
              </div>
              <div class="authorized-info">
                <div class="show-title">预设编制</div>
                <div class="btn-content">
                  <span class="sub-title">行政</span>
                  <span class="sub-content">{{
                    selectOfficeInfo.orgAdmin
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">事业</span
                  ><span class="sub-content">{{
                    selectOfficeInfo.orgCause
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">工勤</span
                  ><span class="sub-content">{{
                    selectOfficeInfo.orgWork
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">单列</span
                  ><span class="sub-content">{{
                    selectOfficeInfo.orgSingle
                  }}</span>
                </div>
                <div>
                  <span class="sub-title">总数</span
                  ><span class="sub-content">{{
                    selectOfficeInfo.orgPrepareTotal
                  }}</span>
                </div>
              </div>
              <div class="show-list">
                <el-table
                  :data="selectOfficeInfo.departmentDetail"
                  @row-click="personAddOffice"
                  height="100%"
                  border
                  style="width: 100%"
                  size="mini"
                  stripe
                  :header-cell-style="{
                    background: '#68d2b2',
                    color: '#FFFFFF',
                  }"
                >
                  <template slot="empty">
                    <p style="margin-top: -10px">暂无数据</p>
                  </template>
                  <el-table-column
                    prop="orgName"
                    label="科室名称"
                    min-width="120"
                  >
                  </el-table-column>
                  <el-table-column
                    prop="prepareTotal"
                    label="编制数"
                    width="100"
                  >
                  </el-table-column>
                  <el-table-column prop="actualNum" label="人数" width="100">
                  </el-table-column>
                  <el-table-column
                    prop="overTotal"
                    label="超空编"
                    width="100"
                    :render-header="renderHeader"
                  >
                  </el-table-column>
                </el-table>
              </div>
            </div>
          </el-card>
        </el-col>
      </el-row>
    </div>

    <div class="person-change">
      <el-row :gutter="20" class="person-card">
        <el-col :span="14" class="person-list">
          <el-card class="" shadow="never">
            <div class="person-list">
              <div class="header">
                <el-radio-group
                  v-model="changeValue"
                  size="small"
                  @change="personTypeSelect"
                >
                  <el-radio-button label="jg"
                    >{{ localOrgName }}领导名单</el-radio-button
                  >
                  <el-radio-button label="cj">处级领导名单</el-radio-button>
                  <el-radio-button label="ks">科室人员名单</el-radio-button>
                </el-radio-group>

                <el-button type="primary" size="small" @click="addPersonPoor"
                  >加入调度池</el-button
                >
              </div>
              <el-table
                ref="multipleTable"
                :data="tableData"
                style="width: 100%"
                border
                size="mini"
                height="100%"
                @selection-change="handleSelectionChange"
              >
                <el-table-column type="selection" width="40"> </el-table-column>
                <el-table-column prop="name" label="姓名" width="100">
                </el-table-column>
                <el-table-column prop="policeNo" label="警号" width="100">
                </el-table-column>
                <el-table-column prop="postBigCateCode" label="职务" width="80">
                  <template slot-scope="scope">
                    <dict-tag
                      :options="dict.type.post_big_cate_code"
                      :value="scope.row.postBigCateCode"
                    />
                  </template>
                </el-table-column>
                <el-table-column label="警衔" width="80">
                  <template slot-scope="scope">
                    <dict-tag
                      :options="dict.type.person_title_type"
                      :value="scope.row.jobTitle"
                    />
                  </template>
                </el-table-column>
                <el-table-column prop="identityNo" label="身份证号" width="160">
                </el-table-column>
                <el-table-column
                  prop="contactPhone"
                  label="联系方式"
                ></el-table-column>
              </el-table>
            </div>
          </el-card>
        </el-col>
        <el-col :span="10" class="person-list">
          <el-card class="" shadow="never">
            <div class="person-content">
              <div class="header">
                <div class="header-title" style="">
                  <i
                    class="el-icon-menu"
                    style="padding-right: 5px; color: #7a9bbd"
                  ></i
                  >调度池
                </div>
              </div>
              <div class="content">
                <el-tag
                  v-for="item in poorList"
                  :key="item.jh"
                  size="small"
                  closable
                  :disable-transitions="false"
                  @close="handleClose(item)"
                  >{{ item.name }}</el-tag
                >
              </div>
              <div class="btn-content">
                <el-button type="primary" plain size="small" @click="goBack"
                  >返回</el-button
                >
                <el-button type="danger" size="small" @click="resetChoose"
                  >重置</el-button
                >
                <el-button type="success" size="small" @click="saveChoose"
                  >确定</el-button
                >
              </div>
            </div>
          </el-card>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import {
  getDetail,
  getSnowFlakeId,
  queryAllPeople,
  queryOfficeOrg,
  queryOrg,
  resetPlan,
  savePersonChange,
} from "@/api/orgadjust/index.js";

export default {
  dicts: ["person_title_type", "post_big_cate_code"],
  data() {
    return {
      changeValue: "jg",
      orgType: "jg",
      selectPersonOrgType: "",
      input: "",
      tableData: [],
      ksList: [
        {
          ks: "科室名称4",
          zk: "实有数 22",
          fk: "实有数 33",
          ck: "超编数 1",
        },
      ],
      personList: [],
      poorList: [],
      localOfficeList: [],
      orgList: [],
      selectOfficeList: [],
      getLocalDetailParams: {},
      getSelectDetailParams: {},
      orgParams: {},
      officeParams: {},
      localOrgId: "",
      localOrgName: "",
      selectOfficeInfo: {},
      localOfficeInfo: {},
      personPersonData: {},
      //调整from
      fromAuthorizedId: undefined,
      //调整to
      tagartAuthorizedId: undefined,
      //编制选择列表
      authorizedSelectList: [],
      //人员选择列表
      personSelectList: [],
      tempPersonSelectList: [],
      tempVersionId: "",
      version: "",
      personUnitTargetId: "",
      planInfo: {
        planCode: "",
        remark: "",
        createTime: "",
        planName: "",
        planId: "",
      },
      clickKs: false,
      clickFirst: 0,
    };
  },
  created() {
    this.localOrgId = this.$route.query.orgId;
    this.fromAuthorizedId = this.localOrgId;
    this.localOrgName = this.$route.query.orgName;
    this.getLocalDetailParams.orgId = this.localOrgId;
    this.getLocalOfficeOrg("");
    this.getOrg("");
    this.getId();
    var params = this.$route.query;
    this.planInfo.planCode = params.planCode;
    this.planInfo.remark = params.remark;
    this.planInfo.createTime = params.createTime;
    this.planInfo.planName = params.planName;
    this.planInfo.planId = params.planId;
    localStorage.setItem("routerFlag", true);
  },
  watch: {
    authorizedSelectList: {
      handler(val, newVal) {
        if (newVal.length > 0) {
          localStorage.setItem("routerFlag", false);
          console.log("authorizedSelectListold", val);
          console.log("authorizedSelectListnew", newVal);
        }
      },
    },
    tempPersonSelectList: {
      handler(val, newVal) {
        if (newVal.length > 0) {
          localStorage.setItem("routerFlag", false);
          console.log("tempPersonSelectListold", val);
          console.log("tempPersonSelectListnew", newVal);
        }
      },
    },
    changeValue: {
      handler(val, oldVal) {
        this.orgType = val
      },
    },
  },
  methods: {
    renderHeader(h, { column, $index }) {
      return [
        column.label,
        h(
          "el-tooltip",
          {
            props: {
              content: "正数为超编，负数为空编",
              placement: "top",
            },
          },
          [h("span", { class: { "el-icon-question": true } })]
        ),
      ];
    },
    //获取id
    getId() {
      let localTempId = localStorage.getItem("tempId");
      if (!localTempId) {
        getSnowFlakeId({}).then((response) => {
          if (response.code == 200) {
            this.tempVersionId = response.data.tempVersionId;
            this.version = response.data.version;
            localStorage.setItem("tempId", this.tempVersionId);
            localStorage.setItem("version", this.version);
          }
        });
      } else {
        this.tempVersionId = localStorage.getItem("tempId");
        this.version = localStorage.getItem("version");
      }
      this.getLocalDetailParams.tempId = this.tempVersionId;
      this.getLocalDetailParams.tempVersionId = this.tempVersionId;
      this.getLocalDetal();
    },
    //调整出去的部门的处的选择
    localOfficeSelect(val) {
      //提交修改编制
      if (this.authorizedSelectList.length > 0) {
        this.personAuthorizedChange();
      }
      this.changeValue = "cj";
      this.clickKs = false;
      this.fromAuthorizedId = val;
      this.getLocalDetal();
    },
    //获取详情
    getLocalDetal() {
      getDetail(this.getLocalDetailParams).then((response) => {
        if (response.code == 200) {
          this.localOfficeInfo = response.data;
        }
      });
      this.getPeople();
    },
    //获取选择的部门所有的处机构
    getLocalOfficeOrg(val) {
      this.officeParams.orgId = this.localOrgId;
      this.officeParams.orgName = val;
      queryOfficeOrg(this.officeParams).then((response) => {
        if (response.code == 200) {
          this.localOfficeList = response.data;
        }
      });
    },
    //选择了部门
    getSelectOfficeOrg(val) {
      this.getSelectDetailParams.officeId = undefined;
      //提交修改编制
      if (this.authorizedSelectList.length > 0) {
        this.personAuthorizedChange();
      }

      this.tagartAuthorizedId = val;
      this.officeParams.orgId = val;
      this.officeParams.orgName = "";
      queryOfficeOrg(this.officeParams).then((response) => {
        if (response.code == 200) {
          this.selectOfficeList = response.data;
        }
      });
      this.getSelectOfficeDetail();
    },
    //选择了处机构
    getSelectOffice(val) {
      //提交修改编制
      if (this.authorizedSelectList.length > 0) {
        this.personAuthorizedChange();
      }

      this.tagartAuthorizedId = val;
      this.getSelectOfficeDetail();
    },
    //获取机构编制科室信息
    getSelectOfficeDetail() {
      this.getSelectDetailParams.tempVersionId = this.tempVersionId;
      getDetail(this.getSelectDetailParams).then((response) => {
        if (response.code == 200) {
          this.selectOfficeInfo = response.data;
        }
      });
    },
    // 获取全部机构列表
    getOrg(val) {
      this.orgParams.orgId = this.localOrgId;
      this.orgParams.orgName = val;
      queryOrg(this.orgParams).then((response) => {
        if (response.code == 200) {
          this.orgList = response.data;
        }
      });
    },
    //点击
    handleCurrentChange(row) {
      this.clickFirst++;
      if (this.clickKs || this.clickFirst === 1) {
        this.changeValue = "ks";
      }
      this.clickKs = true;
      this.getLocalDetailParams.departmentId = row.orgId;
      this.getPeople();
    },
    // 获取干部人员列表
    getPeople() {
      this.getLocalDetailParams.tempId = localStorage.getItem("tempId");
      queryAllPeople(this.getLocalDetailParams).then((response) => {
        if (response.code == 200) {
          this.personPersonData = response.data;
          if (this.changeValue == "jg") {
            this.tableData = this.personPersonData.orgPeopleList;
          } else if (this.changeValue == "cj") {
            this.tableData = this.personPersonData.officeOrgPeopleList;
          } else {
            this.tableData = this.personPersonData.departmentOrgPeopleList;
          }
        }
      });
    },
    saveChoose() {
      //提交修改编制
      if (
        this.authorizedSelectList.length > 0 ||
        this.tempPersonSelectList.length > 0
      ) {
        this.$confirm("是否保存已修改的内容？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            this.personAuthorizedChange("确定");
            this.$message.success("保存成功");
            localStorage.setItem("routerFlag", true);
          })
          .catch(() => {});
      }
    },

    resetChoose() {
      this.$confirm("是否重置已修改的内容？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.authorizedSelectList = [];
          this.tempPersonSelectList = [];
          this.getSelectDetailParams = {};
          this.selectOfficeInfo = {};
          resetPlan(this.tempVersionId).then((response) => {
            if (response.code === 200) {
              this.$message.success("重置成功");
              this.getLocalDetal();
            }
          });
        })
        .catch(() => {});
    },
    goBack() {
      if (
        this.authorizedSelectList.length > 0 ||
        this.tempPersonSelectList.length > 0
      ) {
        this.$confirm("是否保存已修改的内容？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          distinguishCancelAndClose: true,
          type: "warning",
        })
          .then(() => {
            this.personAuthorizedChange("确定");
            this.$message.success("保存成功");
            this.toDetailedRoute();
          })
          .catch((action) => {
            if (action === "cancel") {
              this.toDetailedRoute();
            }
          });
      } else {
        this.toDetailedRoute();
      }
    },
    toDetailedRoute() {
      this.$router.push({
        path: "/orgad/detailed",
        query: {
          orgId: this.localOrgId,
          tempId: this.tempVersionId,
          planCode: this.planInfo.planCode,
          remark: this.planInfo.remark,
          createTime: this.planInfo.createTime,
          planName: this.planInfo.planName,
          planId: this.planInfo.planId,
        },
      });
    },
    handleSelectionChange(value) {
      this.personList = value;
    },
    handleClose(tag) {
      this.poorList.splice(this.poorList.indexOf(tag), 1);
      if (this.poorList.length === 0) {
        this.selectPersonOrgType = "";
      }
      console.log(this.poorList, "我是剩下的数据");
      this.toggleSelection(this.poorList);
    },
    addPersonPoor() {
      let poorMap = {};
      if (
        this.selectPersonOrgType === "" ||
        this.selectPersonOrgType === this.orgType
      ) {
        this.selectPersonOrgType = this.orgType;
        for (let index in this.poorList) {
          poorMap[this.poorList[index].id] = this.poorList[index].name;
        }
        this.personList.forEach((temp) => {
          if (poorMap[temp.id] === undefined || poorMap[temp.id] === null) {
            this.poorList = this.poorList.concat(temp);
          }
        });
      } else {
        this.$message.error("只能添加一类机构的人员进入调度池！");
      }
    },
    toggleSelection(rows) {
      this.$refs.multipleTable.clearSelection();
      if (rows) {
        rows.forEach((row) => {
          this.$refs.multipleTable.toggleRowSelection(row);
        });
      }
    },
    //tab页选择人员类型
    personTypeSelect(val) {
      console.log(val, "选择类型");
      if (val == "jg") {
        this.orgType = "jg";
        this.tableData = this.personPersonData.orgPeopleList;
      } else if (val == "cj") {
        this.tableData = this.personPersonData.officeOrgPeopleList;
        this.orgType = "cj";
      } else {
        this.orgType = "ks";
        this.tableData = this.personPersonData.departmentOrgPeopleList;
      }
    },
    //将缓存池人员
    personAddOffice(info) {
      console.log(info, "++++++", this.poorList);
      if (this.poorList.length > 0) {
        // 注释掉 只能调整到同等级机构
        // if (this.selectPersonOrgType !== "ks") {
        //   this.$message.error("只能调整到同等级机构！");
        //   return;
        // }
        this.$confirm("确定要将人员添加到此科室吗？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            for (let i = 0; i < this.poorList.length; i++) {
              let person = this.poorList[i];
              let personItem = {
                fromOrgId: person.orgId,
                toOrgId: info.orgId,
                personId: person.id,
              };
              this.personSelectList.push(personItem);
            }
            this.personUnityChange();
            // deletePerson(data.id).then((response) => {
            //   if (response.code === 200) {
            //     this.$message.success("删除成功");
            //     this.getPersonPage();
            //   }
            // });
          })
          .catch(() => {});
      }
    },
    //编制减少
    subtractClick(val) {
      if (val == "organ_admin") {
        if (this.localOfficeInfo.orgAdmin == 0) {
          this.$message.error("行政预设编制不能低于0");
          return;
        }
        if (
          this.selectOfficeInfo.orgAdmin !== 0 &&
          !this.selectOfficeInfo.orgAdmin
        ) {
          this.$message.error("请选择编制调整部门");
          return;
        }
        this.localOfficeInfo.orgAdmin--;
        this.selectOfficeInfo.orgAdmin++;
      } else if (val == "organ_cause") {
        if (this.localOfficeInfo.orgCause == 0) {
          this.$message.error("事业预设编制不能低于0");
          return;
        }
        if (
          this.selectOfficeInfo.orgCause !== 0 &&
          !this.selectOfficeInfo.orgCause
        ) {
          this.$message.error("请选择编制调整部门");
          return;
        }
        this.localOfficeInfo.orgCause--;
        this.selectOfficeInfo.orgCause++;
      } else if (val == "organ_work") {
        if (this.localOfficeInfo.orgWork == 0) {
          this.$message.error("工勤预设编制不能低于0");
          return;
        }
        if (
          this.selectOfficeInfo.orgWork !== 0 &&
          !this.selectOfficeInfo.orgWork
        ) {
          this.$message.error("请选择编制调整部门");
          return;
        }
        this.localOfficeInfo.orgWork--;
        this.selectOfficeInfo.orgWork++;
      } else if (val == "organ_single") {
        if (this.localOfficeInfo.orgSingle == 0) {
          this.$message.error("单列预设编制不能低于0");
          return;
        }
        if (
          this.selectOfficeInfo.orgSingle !== 0 &&
          !this.selectOfficeInfo.orgSingle
        ) {
          this.$message.error("请选择编制调整部门");
          return;
        }
        this.localOfficeInfo.orgSingle--;
        this.selectOfficeInfo.orgSingle++;
      }
      this.localOfficeInfo.orgPrepareTotal--;
      this.selectOfficeInfo.orgPrepareTotal++;
      let showItem = this.authorizedSelectList.find(
        (item) => item.organType == val
      );
      if (showItem) {
        showItem.changeNum--;
      } else {
        let item = {
          fromOrgId: this.fromAuthorizedId,
          toOrgId: this.tagartAuthorizedId,
          changeNum: -1,
          organType: val,
        };
        this.authorizedSelectList.push(item);
      }
      console.log(this.authorizedSelectList, "这是编制调整的");
    },
    //编制增加
    plusClick(val) {
      if (val == "organ_admin") {
        if (this.selectOfficeInfo.orgAdmin == 0) {
          this.$message.error("行政预设编制不能低于0");
          return;
        }
        if (!this.selectOfficeInfo.orgAdmin) {
          this.$message.error("请选择编制调整部门");
          return;
        }
        this.localOfficeInfo.orgAdmin++;
        this.selectOfficeInfo.orgAdmin--;
      } else if (val == "organ_cause") {
        if (this.selectOfficeInfo.orgCause == 0) {
          this.$message.error("行政预设编制不能低于0");
          return;
        }
        if (!this.selectOfficeInfo.orgAdmin) {
          this.$message.error("请选择编制调整部门");
          return;
        }
        this.localOfficeInfo.orgCause++;
        this.selectOfficeInfo.orgCause--;
      } else if (val == "organ_work") {
        if (this.selectOfficeInfo.orgWork == 0) {
          this.$message.error("行政预设编制不能低于0");
          return;
        }
        if (!this.selectOfficeInfo.orgAdmin) {
          this.$message.error("请选择编制调整部门");
          return;
        }
        this.localOfficeInfo.orgWork++;
        this.selectOfficeInfo.orgWork--;
      } else if (val == "organ_single") {
        if (this.selectOfficeInfo.orgSingle == 0) {
          this.$message.error("行政预设编制不能低于0");
          return;
        }
        if (!this.selectOfficeInfo.orgAdmin) {
          this.$message.error("请选择编制调整部门");
          return;
        }
        this.localOfficeInfo.orgSingle++;
        this.selectOfficeInfo.orgSingle--;
      }
      this.localOfficeInfo.orgPrepareTotal++;
      this.selectOfficeInfo.orgPrepareTotal--;
      let showItem = this.authorizedSelectList.find(
        (item) => item.organType == val
      );
      if (showItem) {
        showItem.changeNum++;
      } else {
        let item = {
          fromOrgId: this.fromAuthorizedId,
          toOrgId: this.tagartAuthorizedId,
          changeNum: 1,
          organType: val,
        };
        this.authorizedSelectList.push(item);
      }
      console.log(this.authorizedSelectList, "这是编制调整的");
    },
    //人员编制调动 选择
    personAuthorizedChange(type) {
      let info = {
        orgId: this.localOrgId,
        tempVersionId: this.tempVersionId,
        orgList: this.authorizedSelectList,
      };
      if (type === "确定") {
        info = { ...info, version: this.version };
      }
      savePersonChange(info).then((response) => {
        if (response.code === 200) {
          this.authorizedSelectList = [];
          this.tempPersonSelectList = [];
          if (response.data.version) {
            this.version = response.data.version;
            localStorage.setItem("version", this.version);
          }
          getDetail(this.getLocalDetailParams).then((response) => {
            if (response.code == 200) {
              this.localOfficeInfo = response.data;
            }
          });
          localStorage.setItem("routerFlag", true);
        }
      });
    },
    //领导调整
    officeLeaderClick(val, orgType) {
      if (!val) {
        this.$message.error("请选择调整部门");
        return;
      }
      if (this.poorList.length == 0) {
        this.$message.error("请选择调整人员");
        return;
      }
      // 注释掉 只能调整到同等级机构
      // if (orgType !== this.selectPersonOrgType) {
      //   this.$message.error("只能调整到同等级机构！");
      //   return;
      // }
      this.$confirm("确定要将领导添加到该部门吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          for (let i = 0; i < this.poorList.length; i++) {
            let person = this.poorList[i];
            let personItem = {
              fromOrgId: person.orgId,
              toOrgId: val,
              personId: person.id,
            };
            this.personSelectList.push(personItem);
          }
          this.personUnityChange();
        })
        .catch(() => {});
    },
    //人员单位调动
    personUnityChange() {
      this.tempPersonSelectList = this.tempPersonSelectList.concat(
        this.personSelectList
      );
      let info = {
        orgId: this.localOrgId,
        tempVersionId: this.tempVersionId,
        personList: this.personSelectList,
      };
      savePersonChange(info).then((response) => {
        if (response.code === 200) {
          this.$message.success("人员调动成功");
          this.selectPersonOrgType = "";
          this.personSelectList = [];
          this.poorList = [];
          //编制如果修改了 提交修改的编制
          this.getPeople();
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.app-container {
  padding: 10px;
}
.el-card ::v-deep .el-card__body {
  /*height: calc(100vh - 72px);*/
  padding: 10px 15px;
  padding-bottom: 15px;
}
::v-deep .box-card {
  margin-bottom: 0px !important;
}
.header {
  margin-bottom: 10px;
  height: 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  // padding: 0px 10px;
}
.header-other {
  height: 40px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}
.header-title {
  // height: 30px;
  // line-height: 30px;
  font-size: 15px;
  font-weight: bold;
  padding: 0px 0px;
  color: #0d1053;
}
.show-color {
  color: #409eff;
  padding: 0px 10px;
}
.authorized-change {
  /*display: flex;*/
  .introduce {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;

    div {
      color: #409eff;

      &:nth-child(1) {
        font-size: 60px;
      }
      &:nth-child(2) {
      }
    }
  }
  .list {
    flex: 1;
    height: 260px;

    .authorized-info {
      height: 40px;
      line-height: 40px;
      width: 100%;
      display: flex;
      font-size: 13px;
      padding-left: 10px;
      background-color: #f3f3fa;
      margin-top: 5px;

      div {
        display: flex;
        // justify-content: center;
        align-items: center;

        &:nth-child(1) {
          width: 80px;
        }
        // &:nth-child(2) {
        //   width: 120px;
        // }
        &:nth-child(n + 2) {
          flex: 1;
        }
        .sub-title {
          padding-right: 5px;
          color: #7d8796;
          width: 32px;
        }
        .sub-content {
          font-weight: 800;
          padding: 0 3px;
        }
        .btn {
          display: inline-block;
          height: 20px;
          width: 20px;
          border-radius: 10px;
          /*border: #aaa 0.5px solid;*/
          text-align: center;
          line-height: 16px;
          font-size: 15px;
          font-weight: bold;
          cursor: pointer;
          /* margin: 0 5px;*/
          .el-button--mini.is-circle {
            padding: 3px;
          }
          .el-button {
          }
        }
      }
    }
    .show-list {
      height: calc(100% - 100px);
      margin-top: 10px;
    }
  }
  .right-list {
  }
}
.person-change {
  padding-top: 20px;
  /*height: 50%;*/
  width: 100%;
  .person-list {
    /*width: 65%;
    height: calc(100% - 40px);*/
  }
  .person-content {
    height: calc(100% - 40px);
    .content {
      box-sizing: border-box;
      margin-bottom: 10px;
      border-radius: 10px;
      height: calc(30vh - 20px);
      width: calc(100% - 20px);
      border: 1px solid #ddd;
      padding: 10px;
    }
    .btn-content {
      padding-left: 10px;
    }
  }
}
::v-deep .el-tag {
  margin-right: 10px;
}
</style>
